import React, { useState, useEffect } from 'react';
import { ck_float, useForm, IkInput, Wait, uDb, cline, obj_float, ErrView, NuiDlg } from 'sui';
import { g_db } from 'db/state';

const DlgRange = ({ umd, open, setOpen, cur, hcmd }) => {
    const [err, setErr] = useState();
    const [wait, setWait] = useState(false);
    const [value, setValue] = useState();
    const form = useForm(setValue);

    useEffect(() => {
        if (!open) {
            return;
        }

        setValue(cur);
    }, [open, cur]);

    const ck_range = (v, k) => {
        let e = ck_float(v, "最大值");
        if (e) {
            return e;
        }

        const min = obj_float(value, k);
        if (min > v) {
            return "最大值必须大于最小值";
        }

        return null;
    };

    const hdone = () => {
        const ck = {
            "dia_min": v => ck_float(v, "最小值"),
            "dia_max": v => ck_range(v, "dia_min"),
            "dt_min": v => ck_float(v, "最小值"),
            "dt_max": v => ck_range(v, "dt_min"),
            "w_min": v => ck_float(v, "最小值"),
            "w_max": v => ck_range(v, "w_min"),
        };

        if (!form.hcheck(ck, value)) {
            return;
        }

        setWait(true);

        uDb(null, "field/md/awaysplit",
            {
                "line": cline(),
                "v": {
                    "dia_min": obj_float(value, "dia_min"),
                    "dia_max": obj_float(value, "dia_max"),
                    "dt_min": obj_float(value, "dt_min"),
                    "dt_max": obj_float(value, "dt_max"),
                    "w_min": obj_float(value, "w_min"),
                    "w_max": obj_float(value, "w_max"),
                }
            },
            r => {
                setWait(false);
                setOpen(false);
                hcmd();
            }, e => setErr());
    };

    return (
        <NuiDlg open={open} title="设置" hcmd={hdone} labd="确定" hcancel={() => setOpen(false)}>
            <div className="flex flex-col">
                <div className="inline-flex items-center">
                    <div className="mr-2 text-xl">直径范围</div>
                    <IkInput label="最小值" value={value} form={form} name="dia_min" className="m-4" width="w-32" mg="dense"/>
                    <IkInput label="最大值" value={value} form={form} name="dia_max" width="w-32" mg="dense"/>
                </div>
                <div className="inline-flex items-center">
                    <div className="mr-2 text-xl">沟径范围</div>
                    <IkInput label="最小值" value={value} form={form} name="dt_min" className="m-4" width="w-32" mg="dense"/>
                    <IkInput label="最大值" value={value} form={form} name="dt_max" width="w-32" mg="dense"/>
                </div>
                <div className="inline-flex items-center">
                    <div className="mr-2 text-xl">宽度范围</div>
                    <IkInput label="最小值" value={value} form={form} name="w_min" className="m-4" width="w-32" mg="dense"/>
                    <IkInput label="最大值" value={value} form={form} name="w_max" width="w-32" mg="dense"/>
                </div>
            </div>
            <ErrView err={err}/>
            <Wait wait={wait}/>
        </NuiDlg>
    );
};

const reload = (hDone, setMain) => {
    uDb(null, "field/list/awaysplit",
        {
            "line": cline()
        },
        r => {
            g_db.s_dia_min(obj_float(r, "dia_min"));
            g_db.s_dia_max(obj_float(r, "dia_max"));
            g_db.s_dt_min(obj_float(r, "dt_min"));
            g_db.s_dt_max(obj_float(r, "dt_max"));
            g_db.s_w_min(obj_float(r, "w_min"));
            g_db.s_w_max(obj_float(r, "w_max"));

            setMain(r);
        }, e => setMain(null));
};

export {reload, DlgRange};
